<template>
  <div class="bigbox">分类页面</div>
    <!-- 侧边导航栏 -->
  <van-sidebar v-model="activeone" style="float: left;">
  <van-sidebar-item title="全部内容" :to="{path:'/classify/classify1'}"/>
  <van-sidebar-item title="新鲜水果" :to="{path:'/classify/classify2'}"/>
  <van-sidebar-item title="营养早餐" :to="{path:'/classify/classify3'}"/>
  <van-sidebar-item title="休闲用具" :to="{path:'/classify/classify4'}"/>
  <van-sidebar-item title="人气推荐" :to="{path:'/classify/classify5'}"/>
  <van-sidebar-item title="超级好吃" :to="{path:'/classify/classify1'}"/>
  <van-sidebar-item title="一元专区" :to="{path:'/classify/classify2'}"/>
  <van-sidebar-item title="五元专区" :to="{path:'/classify/classify3'}"/>
  <van-sidebar-item title="十元专区" :to="{path:'/classify/classify4'}"/>
</van-sidebar>

  <router-view></router-view>
    <!-- tabbar -->
    <van-tabbar v-model="active" style="z-index: 1;">
  <van-tabbar-item icon="home-o" :to="{path:'/'}">主页</van-tabbar-item>
  <van-tabbar-item icon="search" :to="{path:'/classify/classify1'}">分类</van-tabbar-item>
  <van-tabbar-item icon="browsing-history-o" :to="{path:'/life'}">数据</van-tabbar-item>
  <van-tabbar-item icon="comment-o" :to="{path:'/message'}">消息</van-tabbar-item>
  <van-tabbar-item icon="setting-o" :to="{path:'/car'}">购物车</van-tabbar-item>
  <van-tabbar-item icon="friends-o" :to="{path:'/mine'}">我的</van-tabbar-item>
</van-tabbar>
  </template>
  
  
  <script setup>
  import {ref} from 'vue'
  import {onMounted} from 'vue'
  const active = ref(1)
  const activeone = ref(0)

  onMounted(() => {
  window.scrollTo(0,0)
})
  </script>
  
  <style scoped>
  .bigbox{
    width: 100%;
    height: 50px;
    /* background-color:#BEEDC7; */
    color:grey;
    font-family:serif;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
    border-bottom: 1px solid grey;
    position: relative;
    top: 0;
    left: 0;
    z-index: 100;
  }
  </style>
  